<%@ page contentType="text/html; charset=utf-8" language="java" import="java.util.*" pageEncoding="utf-8" errorPage="" %>
<%@ page import="club325.webchat.servlet.chatcore.ChatRoomManager" %>
<%@ page session="false" %>

<%
	String subject = ChatRoomManager.getURISubject(request); 
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta http-equiv="Keywords" content="WebChat,Chat" />
<meta http-equiv="Description" content="Chatting on Web" />
<title>聊天页面</title>
<link href="/WebChat/style/global.css" rel="stylesheet" type="text/css" />
<link href="/WebChat/style/chat_page.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="/WebChat/lib/util.js"></script>
<script type="text/javascript" src="/WebChat/lib/ajax-pushlet-client.js"></script>

<script type="text/javascript">
<!--
	var chatDoc;
	var chatFrame;
	var name = getPageParameter('name', 'null');
	var subject = getPageParameter('subject', '/null');
	var role = getPageParameter('role', 'null');

	window.onload = chat_init;
	window.onunload = leaveChat;
	
	function chat_init(){
		if (window.frames && window.frames["chat_contents"]) //IE 5 (Win/Mac), Konqueror, Safari
			chatFrame = window.frames["chat_contents"];
		else if (document.getElementById("chat_contents").contentWindow) //IE 5.5+, Mozilla 0.9+, Opera
          	chatFrame = document.getElementById("chat_contents").contentWindow;
        else //Moz < 0.9 (Netscape 6.0)
          	chatFrame = document.getElementById("chat_contents");

        if(chatFrame.document) //Moz 0.9+, Konq, Safari, IE, Opera
          	chatDoc = chatFrame.document;
        else //Moz < 0.9 (Netscape 6.0)
          	chatDoc = chatFrame.contentDocument;

        enterChat();
        document.forms[0].msg.focus();
	}

	// Event Callback for join
	function onJoinAck(event) {
		appendMessage('Listening to chat');
	}

	// Event Callback: display all events
	function onData(event) {
		p_debug(false, "pushlet-app", 'event received event=' + event.getEvent() );
		var date = new Date();
		var time = date.toLocaleTimeString();
		var action = event.get('action');
		var role = event.get('role');
		var content = 'none action=' + action;
		if (action == 'send') {
			content = '<dl class="' + role + '"><dt>' + event.get('name') + ' ' + 
				time + ' </dt><dd>' + event.get('msg').replace(/\n/g, "<br />") + '</dd></dl>';
		} else if (action == 'enter') {
			chat_userlist.location.reload();
			content = '<h1>*** ' + event.get('name') + ' 在 ' + time + ' 进入聊天室 ***</h1>';
		} else if (action == 'exit') {
			chat_userlist.location.reload();
			content = '<h1>*** ' + event.get('name') + ' 在 ' + time + ' 离开聊天室 ***</h1>';
        }
        appendMessage(content);

	}

    // Event Callback: display all events
	function onNack(event) {
		alert('negative response from server: ' + event.getEvent() + ' reason: ' + event.get('p_reason'));
    }

	function appendMessage  (content){
		var newDiv = chatDoc.createElement("DIV");
        newDiv.innerHTML = content;
        chatDoc.getElementById("contents").appendChild(newDiv);
        chatFrame.scrollTo(0, chatDoc.getElementById("contents").offsetHeight);
	}

	function enterChat(){
   		p_join_listen(subject, name);
    	p_publish(subject, 'action', 'enter', 'name', name, 'role', role);
	}

	function sendMsg(){
        p_publish(subject, 'action', 'send', 'name', name, 'msg', document.getElementById("msg").value, 'role', role);
        resetForm();
	}

	function leaveChat(){
		// Send exit to chatters
		p_publish(subject, 'action', 'exit', 'name', name, 'role', role);

		// Stop pushlet session
		p_leave(subject, name);

	}

	function resetForm(){
		document.forms[0].msg.value = "";
		document.forms[0].msg.focus();
	}//-->
</script>
</head>

<body>
<div id="body">
  <div id="body_left">
    <div id="body_left_show">
      <iframe id="chat_contents" name="chat_contents" src="/WebChat/lib/chat_contents.html" width="405" height="350" frameborder="0"></iframe>
    </div>
    <div id="body_left_message">
      <form id="form_message" name="form_message" method="post" action="#" onsubmit="sendMsg(); return false;">
          <textarea name="msg" id="msg"></textarea>
          <input type="submit" name="send" id="send" value="" />
          <input type="reset" name="clear" id="clear" value="" />
      </form>
    </div>
  </div>
  <div id="body_right">
    <div id="body_right_user">
      <h1>聊天成员</h1>
      <div id="body_right_user_list">
        <iframe id="chat_userlist" name="chat_userlist" src="/WebChat/lib/chat_userlist.jsp?subject=<%= subject %>" width="215" height="405" frameborder="0"></iframe>
      </div>
    </div>
    <div id="body_right_control">
      <form id="form_control" name="form_control" method="post" action="#">
          <input type="button" name="leave" id="leave" value="" onclick="self.close();"/>
      </form>
    </div>
  </div>
</div>
</body>
</html>